<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="shortcut icon" href="favicon.ico">
    <link rel="stylesheet" href="../../static/font-awesome//4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="../../static/highlight.js/9.8.0/monokai-sublime.min.css">
    <link rel="stylesheet" href="../../app/css/libs/bootstrap/3.3.7/css/bootstrap.min.css">
    <link rel="stylesheet" href="../../app/css/libs/katex/0.6.0/katex.min.css">
    <link rel="stylesheet" href="../../app/css/libs/videojs/5.11.7/video-js.min.css">
    <link rel="stylesheet" href="../../app/css/dest/styles.css?=2016121272249">

    <link rel="stylesheet" type="text/css" href="../../../bootstrap/css/bootstrap-theme.min.css">
    <link rel="stylesheet" type="text/css" href="../../../css/muke.css">

    <link rel="stylesheet" href="/teacher/js/elementui/index.css">
    <script src="/teacher/js/vue.js"></script>
    <script src="/teacher/js/elementui/index.js"></script>
    <script src="/teacher/js/axios.min.js"></script>

    <style>

        /* modal 模态框*/
        #invite-user .modal-body {
            overflow: hidden;
        }

        #invite-user .modal-body .form-label {
            margin-bottom: 16px;
            font-size: 14px;
        }

        #invite-user .modal-body .form-invite {
            width: 80%;
            padding: 6px 12px;
            background-color: #eeeeee;
            border: 1px solid #cccccc;
            border-radius: 5px;
            float: left;
            margin-right: 10px;
        }

        #invite-user .modal-body .msg-modal-style {
            background-color: #7dd383;
            margin-top: 10px;
            padding: 6px 0;
            text-align: center;
            width: 100%;
        }

        #invite-user .modal-body .modal-flash {
            position: absolute;
            top: 53px;
            right: 74px;
            z-index: 999;
        }

        /* end modal */

        .en-footer {
            padding: 30px;
            text-align: center;
            font-size: 14px;
        }
    </style>

    <style>
        a:hover,
        a:focus {
            text-decoration: none;
        }

        span.label {
            display: inline-block;
            margin: 10px 3px 16px 3px;
            padding: 6px 16px;
            border: none;
            font-size: 14px;
            font-weight: 100;
        }

        span.label-default {
            color: #999;
            background: none;
        }

        span.label-success {
            color: #0c9;
            background: #E7F8F2;
        }

        .userinfo-banner [data-toggle="tooltip"] {
            display: inline-block;
            border-bottom: dashed 1px #999;;
            color: #999 !important;
        }

        .certificate-item {
            padding-top: 10px;
        }

        .certificate-item a {
            color: #444;
        }

        .kc-image {
            width: 300px;
            height: 200px;
        }

    </style>
</head>

<body>
<div id="app">
    <!-- 顶部 -->
    <div class="width100 float_l" style="margin-top: -70px;">
        <div class="width100 float_l height80 line_hei80">

            <!-- 顶部左边 -->
            <div class="float_l">
                <div class="float_l margin_l20">
                    <a href="/student/index.html"><img src="../../../img/uiz1.png"></a>
                </div>
                <div class="float_l">
                    <ul class="ul_li fon_siz16">
                        <li><a class="color_black" href="/student/curricular/courses/index.html">课程</a></li>
                        <li><a class="color_black" href="/student/department.html">院系</a></li>
                        <li><a class="color_black" href="/student/curricular/paths/index.html">名师专栏</a></li>
                    </ul>
                </div>
            </div>

            <!-- 顶部右边 -->
            <div class="float_r">
                <div class="float_l top_input">
                    <input class="posi_relative" type="text" name="" id="" placeholder="请输入想搜索的内容...">
                    <img class="img_sousuo bianshou" src="../../../img/uiz4.png">
                </div>
                <div class="float_l margin_l20">
                    <img src="../../../img/uiz5.png">
                </div>
                <div class="float_l margin_l35">
                    <img src="../../../img/uiz6.png">
                </div>
                <div class="float_l margin_l30 margin_r40">
                    <a class="color_black" href="curricular/user/13/course.html" v-show="isCenter">个人中心</a>&nbsp;&nbsp;
                    <a class="btn btn-default navbar-btn sign-in" href="javascript:void(0)" @click="login()" v-show="isShow">登录</a>
                    <el-dropdown>
                        <div class="color_black" v-show="isCenter">
                            <img :src="userPhoto" width="45px" >
                            <i class="el-icon-arrow-down el-icon&#45;&#45;right"></i>
                        </div>
                        <el-dropdown-menu slot="dropdown">
                            <el-dropdown-item @click.native="shezhi()">设置</el-dropdown-item>
                            <el-dropdown-item @click.native="tuichu()">退出</el-dropdown-item>
                        </el-dropdown-menu>
                    </el-dropdown>
                </div>
            </div>
        </div>
    </div>


    <div class="userinfo-banner layout-no-margin-top">
        <div class="container layout">
            <div class="row">
                <div class="col-md-9 clearfix">
                    <div class="pull-left userinfo-banner-avatar">
                        <div class="user-avatar ">
                            <!-- 	用戶头像 -->
                            <a class="avatar" href="javascript:void(0)">
                                <img :src="active.photo">
                            </a>
                        </div>
                    </div>
                    <div class="pull-left userinfo-banner-details">
                        <div class="userinfo-banner-meta">
                            <div class="user-username ">
                                <a class="username" href="#" target="_blank">用户名</a>
                            </div>
                        </div>
                        <div class="userinfo-banner-status">
                            <span>{{active.loginName}}</span>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
    <div class="container layout">
        <div class="row">
            <div class="col-md-9 layout-body">
                <div class="content" role="tabpanel">
                    <ul class="nav nav-tabs" rolw="tablist">
                        <li role="presentation">
                            <a href="questions.html" role="tab">讨论</a>
                        </li>
                        <li role="presentation" class="active">
                            <a href="javascript:void(0)" role="tab">课程</a>
                        </li>
                    </ul>

                    <div class="kc-content">
                        <el-row :gutter="80">
                            <el-col :span="8" v-for="(item ,i) in courData">
                                <el-card :body-style="{ padding: '0px' }">
                                    <a :href="'/student/curricular/courses/show.html?courId='+item.courId">
                                        <img :src="item.courPicurl" class="kc-image"
                                             onerror="onerror=null;src='../image/zwtp.jpg'">
                                    </a>
                                    <div style="padding: 14px; text-align: center;font-size: 16px;">
                                        <span>
                                            <a :href="'/student/curricular/courses/show.html?courId='+item.courId">{{item.courName}}</a>
                                        </span>
                                    </div>
                                    <div style="text-align: center;">
                                        <el-tag type="success">
                                            已学: {{item.chaIndex+1}}/{{item.countChaSum-1}} 总共
                                        </el-tag>
                                    </div>
                                    <div style="padding: 15px;">
                                        <el-progress :show-text="false" :stroke-width="10" :percentage="((item.chaIndex+1)/(item.countChaSum-1))*100"></el-progress>
                                        <br>
                                        <el-tag type="warning">
                                            报名时间:{{item.starttime}}
                                        </el-tag>
                                    </div>
                                </el-card>
                            </el-col>
                        </el-row>
                        <el-row type="flex" justify="center">
                            <el-pagination
                                    layout="prev, pager, next"
                                    :current-page.sync="query.page"
                                    :page-size="query.rows"
                                    @current-change="queryKc"
                                    :total="total">
                            </el-pagination>
                        </el-row>
                    </div>
                </div>

            </div>

            <!-- 页面右侧 -->

        </div>
    </div>

    <!-- 页脚 -->
    <div class="width100 float_l padding_t30 height193">
        <div class="width_1200 margin_auto">
            <div class="width100 float_l text_c margin_b30">
                <a class="img_backg5" href="#"></a>
                <a class="img_backg6 posi_relative wexinmaxianshi" href="#"><i class="weixinweima dis_none"><img
                        src="../../../img/idx-btm.png"></i></a>
                <a class="img_backg7" href="#"></a>
                <a class="img_backg8" href="#"></a>
            </div>
            <div class="width100 float_l text_c yejiao color_gray">
                <a>关于我们</a>
                <a>企业合作</a>
                <a>人才招聘</a>
                <a>讲师招募</a>
                <a>联系我们</a>
                <a>意见反馈</a>
                <a>友情链接</a>
            </div>
            <div class="width100 float_l text_c border_t margin_t20 padding_t20 color_gray fon_siz12">
                <span>© 2016 imoroc.com 京ICP备13042132号</span>
            </div>
        </div>
    </div>


</div>
</body>
<script src="js/studentjs.js"></script>
</html>
